<div class="login-wrapper" id="login-content" xmlns:th="http://www.thymeleaf.org">
    <div class="login-content">
        <a href="#" class="close">x</a>
        <h3>登录</h3>
        <form id="login_form">
            <input type="hidden" id="login-type" value="user">
            <div class="row">
                <label for="username">
                    用户名:
                    <input type="text" name="username" id="username" placeholder="请输入用户名" value="rose"
                           minlength="4" required="required"
                           style="text-transform: lowercase"/>
                </label>
            </div>

            <div class="row">
                <label for="password">
                    密码:
                    <input type="password" name="password" id="password" value="rose"
                           minlength="4"
                           required="required"/>
                </label>
            </div>
            <div class="row">
                <div class="remember">
                    <div>
                        <input type="checkbox" name="remember-me" checked value="true"><span>记住登录</span>
                    </div>
                    <a href="/movie/forget">忘记密码 ?</a>
                </div>
            </div>
            <div class="row">
                <button type="button" onclick="autoLogin()" id="login_submit">登录</button>
            </div>
        </form>
    </div>
</div>
<div class="login-wrapper" id="signup-content" xmlns:th="http://www.thymeleaf.org">
    <div class="login-content">
        <h3>注册用户</h3>
        <form id="register-user-form">
            <div class="row">
                <label for="account">
                    用户名:
                    <input type="text" name="account" id="account" placeholder="请输入用户名"
                           required="required" style="text-transform: lowercase" minlength="4" value="rose"/>
                </label>
            </div>

            <div class="row">
                <label for="email">
                    邮箱:
                    <input type="email" name="email" id="email" placeholder="" value="cearnach@foxmail.com"
                           pattern="^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$"
                           required="required" style="text-transform: lowercase"/>
                </label>
            </div>
            <div class="row">
                <label for="reg-password">
                    密码:
                    <input type="password" id="reg-password" placeholder="" value="rose"
                           minlength="4"
                           required="required"/>
                </label>
            </div>
            <div class="row">
                <label for="reg-re-password">
                    再次输入密码:
                    <input type="password" id="reg-re-password" placeholder="" value="rose"
                           minlength="4"
                           required="required"/>
                </label>
            </div>
            <div class="row">
                <button type="button" onclick="registerUser()">注册用户</button>
            </div>
        </form>
    </div>
</div>

<header class="ht-header" xmlns:th="http://www.thymeleaf.org">
    <div class="container">
        <nav class="navbar navbar-default navbar-custom">
            <!-- Brand and toggle get grouped for better mobile display -->
            <div class="navbar-header logo">
                <div class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                    <span class="sr-only">Toggle navigation</span>
                    <div id="nav-icon1">
                        <span></span>
                        <span></span>
                        <span></span>
                    </div>
                </div>
                <a href="/"><img class="logo" src="/movie/images/logo1.png" alt="" width="119" height="58"></a>
            </div>
            <!-- Collect the nav links, forms, and other content for toggling -->
            <div class="collapse navbar-collapse flex-parent" id="bs-example-navbar-collapse-1">
                <ul class="nav navbar-nav flex-child-menu menu-left">
                    <li class="hidden">
                        <a href="#page-top"></a>
                    </li>
                    <li class="dropdown first">
                        <a href="/">
                            首页
                        </a>
                    </li>
                    <li class="dropdown first">
                        <a href="/movie/list/grid">
                            电影列表
                        </a>
                    </li>
                    <li class="dropdown first">
                        <a href="/person/list/grid">
                            演员列表
                        </a>

                    </li>
                    <li class="dropdown first">
                        <a href="/movie/news/list">
                            影视新闻
                        </a>

                    </li>
                    <li class="dropdown first">
                        <a class="btn btn-default dropdown-toggle lv1" data-toggle="dropdown" data-hover="dropdown">
                            社区 <i class="fa fa-angle-down" aria-hidden="true"></i>
                        </a>
                        <ul class="dropdown-menu level1">
                            <li><a href="userfavoritegrid.html">user favorite grid</a></li>
                            <li><a href="userfavoritelist.html">user favorite list</a></li>
                            <li><a href="userprofile.html">user profile</a></li>
                            <li class="it-last"><a href="userrate.html">user rate</a></li>
                        </ul>
                    </li>
                </ul>
                <ul class="nav navbar-nav flex-child-menu menu-right">
                    <li class="dropdown first">
                        <a class="btn btn-default dropdown-toggle lv1" data-toggle="dropdown" data-hover="dropdown">
                            页面 <i class="fa fa-angle-down" aria-hidden="true"></i>
                        </a>
                        <ul class="dropdown-menu level1">
                            <li><a href="landing.html">Landing</a></li>
                            <li><a href="404.html">404 Page</a></li>
                            <li class="it-last"><a href="comingsoon.html">Coming soon</a></li>
                        </ul>
                    </li>
                    <li><a href="#">帮助</a></li>
                    <li class="loginLink" th:style="${adminAccount=='anonymousUser'?'':'display:none'}">
                        <a href="#">登录</a>
                    </li>
                    <li class="btn signupLink" th:style="${adminAccount=='anonymousUser'?'':'display:none'}">
                        <a href="#">注册</a>
                    </li>

                    <li th:style="${adminAccount=='anonymousUser'?'display:none':adminAccount}">
                        <a href="/user/profile"
                           th:text="${adminAccount}" style="color: #cf590c;">用户名</a>
                    </li>
                    <li th:style="${adminAccount=='anonymousUser'?'display:none':''}">
                        <a onclick="logout()" style="color: yellow">退出登录</a>
                    </li>


                </ul>
            </div>
            <!-- /.navbar-collapse -->
        </nav>
        <!-- top search form -->
        <div class="top-search">
            <select id="select-movie-search">
                <option value="name">名称</option>
            </select>
            <input type="text" placeholder="请输入要查找的电影名称或者类型" id="movie-search">
        </div>
    </div>
</header>

<script>
    $('#movie-search').bind('keypress', function (event) {
        if (event.keyCode == 13) {
            var searchStr = $('#movie-search').val();
            var searchType = $('#select-movie-search').val();
            var searchUrl = '/movie/search/' + searchType + "/" + searchStr
            window.location = searchUrl;
        }
    });
    initLoginForm();
</script>
